<template >
    <div class="body">
        <div class="box">
            <h3 class="title">登录页面</h3>
            <el-input placeholder="请输入账号" v-model="input" clearable prefix-icon="el-icon-s-custom" class="txt" size="small"></el-input>
            <el-input placeholder="请输入密码" v-model="pwd" show-password  prefix-icon="el-icon-lock" class="txt" size="small"></el-input>
            <el-button type="info" class="btn" @click="submit" size="small">提交</el-button>
        </div>
    </div>
</template>

<script>
    export default {
        
    data() {
      return {
        input: '',
        pwd:''
      }
  },
  methods:{
      submit(){
          this.$router.push('/index')
      }
  }
    }
</script>

<style lang="less" scoped>

.body{
    box-sizing: border-box;
    padding-top: 150px;
    height: 100vh;
    width: 100vw;
    background:url(../../assets/img/img1.jpeg) no-repeat ;
    background-size: cover;
    .box{
        
    width: 300px;
    margin: 0 auto;
    text-align: center;
    padding: 30px 50px;
    border-radius: 20px;
    background-color: rgba(0,0,0,0.3);
        .txt{
        width: 100%;
        margin-bottom: 20px;
        }
        .btn{
            width: 100%;
            
        }
        .title{
            margin-bottom: 20px;
            color: #fff;
        }
    }
}

    
</style>